﻿@{
    ViewBag.Title = "每周菜肴";
    Layout = "~/Views/Shared/_LayoutList.cshtml";
   
    var grid = Html.DWZGridFor<DishRange>()
        .ID("grdList")
        .Action(@Url.Action("List"))
        .Width("mainWidth")
        .ExtParam(new { Type = "$('#Type').val()" })
        .Columns(col =>
        {
            col.Bind(e => e.Id).IsKey();
            col.Bind(e => e.Code).Width(60).AsQuery();
            col.Bind(e => e.Name).Width(100).AsQuery().Align(FlexiGridAlign.Left);
            col.Bind(e => e.Category).EnumKey("DishType").Width(40);
            col.Bind(e => e.DishCost).Align(FlexiGridAlign.Right);
            col.Bind(e => e.DishPrice).Align(FlexiGridAlign.Right);
            col.Bind(e => e.Date).Width(70).DateFormat("yyyy-MM-dd");
            col.Bind(e => e.Id, "操作", 100).Sortable(false)
                .Template(Url.DeleteLink("Delete", "${Name}"));
        })
        .Buttons(btn =>
        {
            btn.Bind("Add", "选择菜肴", FlexiGridButtonType.Add).OnPress("AddDish");
        });
}
@Html.Css("tree")
@Html.Js("tree")
<script type="text/javascript">
    var maiheight = document.documentElement.clientHeight;
    var mainWidth = document.documentElement.clientWidth - 3 - 200; // 减去边框和左边的宽度
    var otherpm = 82;
    var gh = maiheight - otherpm;
    $(document).ready(function () {
        // 部门树控件
        $("#Tree").treeview({
            url: '@Url.Action("Tree")',
            showcheck: false,
            onnodeclick: TreeNode_Click,
            theme: "bbit-tree-no-lines" //bbit-tree-lines ,bbit-tree-no-lines,bbit-tree-arrows
        }).height(maiheight - 30);

        // 默认选中下周的当天
        $("#Tree").clickTreeNode('@ViewBag.DefaultDate');

        //默认周数为当前周
        $("#AddWeekNum").val('@ViewBag.AddWeekNum');
    });
    function TreeNode_Click(data) {
        // 刷新右边的列表，并保存当前节点的值
        $("#grdList").flexOptions({ extParam: [{ name: "Type", value: data.id}] }).flexReload();
        $("#Type").val(data.id);
        $("#ListTitle").text(data.value);
    }
    // 选择菜肴
    function AddDish() {
        var url = '@Url.Action("MultipleLookup", "Dish")';
        OpenModelWindow(url, { width: 840, height: 400, caption: "选择菜肴", onclose: function (data) {
            if (data) {

                var json = { date: $('#Type').val() };
                json["DishList"] = data;
                $.ajax({
                    type: 'POST',
                    url: '@Url.Action("Save")',
                    dataType: "json",
                    cache: false,
                    data: JSON.stringify(json),
                    contentType: 'application/json; charset=utf-8',
                    success: function (data) {
                        if (data.IsSuccess) {
                            refreshGrid();
                        }
                        else {
                            showErrorTip(data.Msg, { left: 10, top: 100 }, true, 3000);
                        }
                    }
                });
            }
        }
        });
        return false;
    }

    function ChooseProWeek() {        
        //$("#AddWeekNum").val((parseInt($("#AddWeekNum").val()) + parseInt(Num)).toString());
        $("#Tree").treeview({
            url: '@Url.Action("ChooseProWeek")', //
            showcheck: false,
            onnodeclick: TreeNode_Click,
            theme: "bbit-tree-no-lines"
        }).height(maiheight - 30);
    }

    function ChooseNextWeek() {
        $("#Tree").treeview({
            url: '@Url.Action("ChooseNextWeek")', 
            showcheck: false,
            onnodeclick: TreeNode_Click,
            theme: "bbit-tree-no-lines"
        }).height(maiheight - 30);
    }

    function ChangeWeek(week) {
       var day = week.split('day=')[1];
        var val = day + "（星期一）";
        var data = { id: day, value: val };
        //树刷新的方法
        $("#Tree").treeview({
            url: '@Url.Action("Tree")?datetime=' + day, 
            showcheck: false,
            onnodeclick: TreeNode_Click,
            theme: "bbit-tree-no-lines"
        }).height(maiheight - 75);  
        //缺少树刷新的方法 需要显示当前下拉选中周的信息
        $("#grdList").flexOptions({ extParam: [{ name: "Type", value: data.id}] }).flexReload();
        $("#Type").val(data.id);
        $("#ListTitle").text(data.value) 
    }

</script>
<div class="MainContainer" style="overflow: hidden;">
    <table width="100%" cellpadding="0" cellspacing="0" class="tree_grid_panel_table">
        <tbody>
            <tr>
                <td style="width: 200px;">
                    <div style="background-color: #DFE8F6; border: #99bbe8 1px solid; text-align: center;
                        padding: 5px 3px; display: block; height: 50px;">
                        周数：
                        @Html.DropDownList("SelectWeek", ViewBag.WeekList as IEnumerable<SelectListItem>,
                                          new { style = "width: 150px; height: 22px;", onchange = "Javascript:ChangeWeek(this.value)" })
                       </div> @*<a id="btnProWeek" class="button" href="javascript:ChooseProWeek();"><span>往上</span></a>
                        <a id="btnNextWeek" class="button" href="javascript:ChooseNextWeek();"><span>往下</span></a>*@
                    <div id="Tree" class="treeview">
                    </div>
                </td>
                <td style="width: 2px;">
                </td>
                <td>
                    <div class="header">
                        <span id="ListTitle" class="title">餐单列表</span></div>
                    @Html.Raw(grid.ToString())
                </td>
            </tr>
        </tbody>
    </table>
    @Html.Hidden("Type")
    @Html.Hidden("AddWeekNum","0")
</div>
